Highlight kebab-case Vue component tags#115
Highlight kebab-case Vue component tags#115lei233 wants to merge 1 commit intozed-extensions:mainfrom
Conversation
|
We require contributors to sign our Contributor License Agreement, and we don't have @lei233 on file. You can sign our CLA at https://zed.dev/cla. Once you've signed, post a comment here that says '@cla-bot check'. |
|
@cla-bot check |
|
The cla-bot has been summoned, and re-checked this pull request! |
icarusgk
left a comment
icarusgk
left a comment
There was a problem hiding this comment.
Can confirm this works as expected with PascalCase and kebab-case components.
MrSubidubi
left a comment
MrSubidubi
left a comment
There was a problem hiding this comment.
Thanks for this!
Overall looks good, but wondering whether we can by any chance not simplify the regexes a bit? I see that with your match, you prevent matching invalid identifiers, wondeirng whether we cannot perhaps still match them despite being invalid to simplify things a bit for the matching itself?
Also, while you are at it, could you remove the @tag and replace it with just the @tag.component.type.constructor in that query? That should make things a bit more efficient without losing any functionality.
3 participants
Summary
This updates Vue syntax highlighting so kebab-case component tags are highlighted as components.
Previously, only PascalCase tags matched the component rule, so tags like
<my-component>fell back to regular tag highlighting.Changes
<div>as regular tags<MyComponent>highlighted as components<my-component>as componentsVerification
Tested in Zed after reloading extensions with examples like: